<template>
	<view>
		<nav-bar></nav-bar>
		<view style="margin-top:18px;padding: 0 22px;">
			<view class="flex flex-row" style="font-size: 25px;font-weight: 700;color: #000000;marigin-top:18px;">
				{{ news.newsname }}
			</view>
			<view class="flex flex-row" style="margin-top:20px;">
				<view style="width:80px;font-size: 14px;font-weight: 500;color: #9C9C9C;">关键词：</view>
				<view class="flex-1 flex flex-row" style="font-size: 14px;font-weight: 400;color: #000000;">
					<view v-for="(item,index) in news.guanjianci.split('、')"
						style="font-size: 10px;font-family: PingFangHK-Regular, PingFangHK;font-weight: 400;color: #FE7743;padding-left: 0.125rem;padding-right: 0.125rem;margin-right: 0.375rem;border: 1px solid #FE7743;">
						{{ item}}
					</view>


				</view>

			</view>
			<view class="flex flex-row" style="margin-top:20px;">
				<view style="width:80px;font-size: 14px;font-weight: 500;color: #9C9C9C;">资讯来源：</view>
				<view class="flex-1" style="font-size: 14px;font-weight: 400;color: #000000;">{{ news.zixunlaiyuan }}
				</view>
			</view>
			<view class="flex flex-row" style="margin-top:20px;">
				<view style="width:80px;font-size: 14px;font-weight: 500;color: #9C9C9C;">发布时间：</view>
				<view class="flex-1" style="font-size: 14px;font-weight: 400;color: #000000;">{{ news.createTime }}
				</view>
			</view>
			<!-- <view class="news-content" v-html="news.content"></view> -->
			<view class="news-content" v-html="setContent(news.content)"></view>
			<view style="padding:17px 27px;height: 121px;background: #FFFAF7;margin-top:37px;">
				<view class="flex flex-row justify-center" style="font-size: 12px;font-weight: 500;color: #000000;">
				</view>

				<view style="margin-top:13px;">
					<view class="flex flex-row" style="height: 38px;background: #FFFFFF;position: relative;">
						<view class="inputlable"></view>
						<view class="inputcontent"><u--input placeholder="请输入联系方式" border="surround"
								v-model="phone"></u--input></view>
						<view
							style="background: #FE7743;font-size: 10px;font-weight: 600;color: #FFFFFF;padding: 8px 13px;position: absolute;top: 3px;right: 4px;"
							@click="handleFilter">
							我要对接
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: 0,
				news: {},
				phone: ''
			};
		},

		onLoad(option) {
			this.id = option.id;
			this.getNewsDetail(option.id);

			// uni.setNavigationBarTitle({
			// 	title: this.news.newsname + '- 第1园区'
			// });
		},
		methods: {
			setContent(res) {
				const regex = new RegExp('<img', 'gi');
				return res.replace(regex, '<img style="max-width: 100%; height: auto"');
			},
			getNewsDetail() {
				let that = this;
				this.$apiCall.request(
					'get',
					`/news/${this.id}`, {}, {
						sucCb(data) {
							that.news = data.data;

							let str = that.news.newsname ? '' + that.news.newsname : '';
							// console.log(that.news.newsname, 111111);
							str = str + '·' + '第1园区';
							uni.setNavigationBarTitle({
								title: str
							});
						}
					}
				);
			},
			handleFilter() {
				let that = this;
				this.$apiCall.request(
					'get',
					`/guanggao/${'news_detail_1'}`, {}, {
						sucCb(data) {
							that.newsad = data.data;
							console.log(that.newsad);
						}
					}
				);
			}
		}
	};
</script>

<style lang="scss">
	.news-content {
		margin-top: 30px;
		font-size: 12px;
		font-weight: 400;
		color: #000000;

		.img {
			width: 100% !important;
			margin: 15px auto;
			float: left;
		}
	}
</style>